// 所有react项目都要有
import react, { Component, Fragment } from 'react';
// 虚拟DOM、JSX解析器
import reactDom from 'react-dom';

import propTypes from 'prop-types';

// 引入样式表
import './index.css';

// 组件的运用：组合、嵌套。
class App extends Component {
  render() {
    return (
      <>
        <h1>计数器</h1>
        <Count />
      </>
    );
  }
}

// 函数式组件使用状态的方法，通过hooks实现。
// 同样一个功能，class组件能够实现，函数式组件也能实现，只是方法不同。
// 函数式组件，使用state，是专门有一个hooks，能过useState()方法实现。
const Count = () => {
  return (
    <>
      <p>记数：</p>
      <p>
        <button>+</button>
        <button>-</button>
      </p>
    </>
  );
};

reactDom.render(<App />, document.getElementById('root'));
